// 初始化用户数据
let users = []

// 页面加载时从localStorage获取用户数据
document.addEventListener('DOMContentLoaded', function () {
  const storedUsers = localStorage.getItem('users')
  if (storedUsers) {
    users = JSON.parse(storedUsers)
  }

  // 检查是否已登录
  const currentUser = localStorage.getItem('currentUser')
  if (currentUser) {
    updateUserDisplay(currentUser)
  }
})

// 显示登录模态框
function showLoginModal() {
  document.getElementById('loginModal').style.display = 'block'
}

// 显示注册模态框
function showRegisterModal() {
  document.getElementById('registerModal').style.display = 'block'
}

// 关闭模态框
function closeModal(modalId) {
  document.getElementById(modalId).style.display = 'none'
}

// 处理注册
function handleRegister(event) {
  event.preventDefault()
  const username = document.getElementById('registerUsername').value
  const password = document.getElementById('registerPassword').value
  const errorElement = document.getElementById('registerError')

  if (!username || !password) {
    showError(errorElement, '请填写完整的注册信息！')
    return
  }

  // 检查用户名是否已存在
  if (users.some((user) => user.username === username)) {
    showError(errorElement, '用户名已存在！')
    return
  }

  // 添加新用户
  users.push({ username, password })
  localStorage.setItem('users', JSON.stringify(users))

  // 自动登录
  localStorage.setItem('currentUser', username)
  updateUserDisplay(username)

  // 关闭模态框
  closeModal('registerModal')

  // 清空表单
  document.getElementById('registerForm').reset()
}

// 处理登录
function handleLogin(event) {
  event.preventDefault()
  const username = document.getElementById('loginUsername').value
  const password = document.getElementById('loginPassword').value
  const errorElement = document.getElementById('loginError')

  if (!username || !password) {
    showError(errorElement, '请填写完整的登录信息！')
    return
  }

  // 验证用户名和密码
  const user = users.find(
    (u) => u.username === username && u.password === password
  )

  if (user) {
    localStorage.setItem('currentUser', username)
    updateUserDisplay(username)
    closeModal('loginModal')
    document.getElementById('loginForm').reset()
  } else {
    showError(errorElement, '用户名或密码错误！')
  }
}

// 显示错误信息
function showError(element, message) {
  element.textContent = message
  element.style.display = 'block'
  setTimeout(() => {
    element.style.display = 'none'
  }, 3000)
}

// 更新用户显示
function updateUserDisplay(username) {
  const welcomeDiv = document.querySelector('.welcome')
  const loginLink = document.querySelector('.login')
  const registerLink = document.querySelector('.register')

  // 移除登录和注册链接
  loginLink.style.display = 'none'
  registerLink.style.display = 'none'

  // 添加用户名显示
  const usernameSpan = document.createElement('span')
  usernameSpan.className = 'username-display'
  usernameSpan.textContent = `欢迎，${username}`

  // 添加退出登录按钮
  const logoutLink = document.createElement('a')
  logoutLink.href = '#'
  logoutLink.textContent = '退出登录'
  logoutLink.onclick = function (e) {
    e.preventDefault()
    localStorage.removeItem('currentUser')
    location.reload()
  }

  welcomeDiv.appendChild(usernameSpan)
  welcomeDiv.appendChild(logoutLink)
}

// 退出登录
function logout() {
  localStorage.removeItem('currentUser')
  location.reload()
}
